<!--
 * @Descripttion: 
 * @Author: jhw
 * @Date: 2023-05-15 21:55:00
 * @LastEditors: jhw
 * @LastEditTime: 2023-05-15 22:07:23
-->
<template>
  <div>
    <el-button @click="getColor">取色器</el-button>
    {{ drroper }}
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue';

const drroper = ref('');

const getColor = async () => {
  const drroper = new EyeDropper();
  try {
    const result = await drroper.open();
    console.log(result);
    drroper.value = result.sRGBHex;
  } catch (error) {
    console.log('user cancel');
  }
};
</script>

<style scoped></style>
